/*显示默认月份的日历*/
var dayUlEle = document.querySelector(".month-ul");
for (let i = 0; i < dayUlEle.children.length; i++) {
    if(dayUlEle.children[i].classList.contains('month-tab')){
        var ul = document.querySelector(".day");
        if(dayUlEle.children[i].classList.contains('month-tab-9')){
            var day =0;
            for (let i = 0; i < 35; i++) {
                if (i < 2) {
                    var li = '<li>' +
                        '</li>';
                    ul.innerHTML += li;
                }else if(i>31) {
                    var li = '<li>' +
                        '</li>';
                    ul.innerHTML += li;
                }
                else {
                    var li =
                        '<li class="residual">' +
                        '<div class="border"></div>' +
                        '<div class="day-number">' + (++day) + '</div>' +
                        '<div class="day-price">' +
                        '<span>￥</span>' +
                        '<span>'+(2300+i)+'</span>' +
                        '<span>起</span>' +
                        '<br>' +
                        '<span>余</span>' +
                        '<span>30</span>' +
                        '</div>' +
                        '</li>';
                    ul.innerHTML += li;
                }
            }
        }
        if(dayUlEle.children[i].classList.contains('month-tab-10')){
            var day =0;
            for (let i = 0; i < 35; i++) {
                if (i < 4) {
                    var li = '<li>' +
                        '</li>';
                    ul.innerHTML += li;
                }  else {
                    var li =
                        '<li class="residual">' +
                        '<div class="border"></div>' +
                        '<div class="day-number">' + (++day) + '</div>' +
                        '<div class="day-price">' +
                        '<span>￥</span>' +
                        '<span>'+(2300+i)+'</span>' +
                        '<span>起</span>' +
                        '<br>' +
                        '<span>余</span>' +
                        '<span>30</span>' +
                        '</div>' +
                        '</li>';
                    ul.innerHTML += li;
                }
            }
        }
        if(dayUlEle.children[i].classList.contains('month-tab-11')){
            var day =0;
            for (let i = 0; i < 35; i++) {
                if (i >29) {
                    var li = '<li>' +
                        '</li>';
                    ul.innerHTML += li;
                }else {
                    var li =
                        '<li class="residual">' +
                        '<div class="border"></div>' +
                        '<div class="day-number">' + (++day) + '</div>' +
                        '<div class="day-price">' +
                        '<span>￥</span>' +
                        '<span>'+(2300+i)+'</span>' +
                        '<span>起</span>' +
                        '<br>' +
                        '<span>余</span>' +
                        '<span>30</span>' +
                        '</div>' +
                        '</li>';
                    ul.innerHTML += li;
                }
            }
        }
    }
}

document.querySelector(".calendar-year-month").onclick = function (event){
    var ele = event.target;
    ele = ele.parentElement;
    /*左右按钮*/
    var ulEle = document.querySelector(".month-ul");
    if(ele.nodeName === "SPAN" && ele.className==="left"){
        for (let i = 0; i < ulEle.children.length; i++) {
            if(ulEle.children[i].classList.contains('month-tab') === true && i!== 0){
                ulEle.children[i].classList.remove('month-tab');
                ulEle.children[i-1].classList.add('month-tab');
                var ul = document.querySelector(".day");
                for (let i = 0; i < ul.children.length; i++) {
                    console.log(ul.children[i]);
                    ul.removeChild(ul.children[i--]);
                }
                if(ulEle.children[i-1].classList.contains('month-tab-9')){
                    var day =0;
                    for (let i = 0; i < 35; i++) {
                        if (i < 2) {
                            var li = '<li>' +
                                '</li>';
                            ul.innerHTML += li;
                        }else if(i>31) {
                            var li = '<li>' +
                                '</li>';
                            ul.innerHTML += li;
                        }
                        else {
                            var li =
                                '<li class="residual">' +
                                '<div class="border"></div>' +
                                '<div class="day-number">' + (++day) + '</div>' +
                                '<div class="day-price">' +
                                '<span>￥</span>' +
                                '<span>'+(2300+i)+'</span>' +
                                '<span>起</span>' +
                                '<br>' +
                                '<span>余</span>' +
                                '<span>30</span>' +
                                '</div>' +
                                '</li>';
                            ul.innerHTML += li;
                        }
                    }
                }
                if(ulEle.children[i-1].classList.contains('month-tab-10')){
                    var day =0;
                    for (let i = 0; i < 35; i++) {
                        if (i < 4) {
                            var li = '<li>' +
                                '</li>';
                            ul.innerHTML += li;
                        }  else {
                            var li =
                                '<li class="residual">' +
                                '<div class="border"></div>' +
                                '<div class="day-number">' + (++day) + '</div>' +
                                '<div class="day-price">' +
                                '<span>￥</span>' +
                                '<span>'+(2300+i)+'</span>' +
                                '<span>起</span>' +
                                '<br>' +
                                '<span>余</span>' +
                                '<span>30</span>' +
                                '</div>' +
                                '</li>';
                            ul.innerHTML += li;
                        }
                    }
                }
                if(ulEle.children[i-1].classList.contains('month-tab-11')){
                    var day =0;
                    for (let i = 0; i < 35; i++) {
                        if (i >29) {
                            var li = '<li>' +
                                '</li>';
                            ul.innerHTML += li;
                        }else {
                            var li =
                                '<li class="residual">' +
                                '<div class="border"></div>' +
                                '<div class="day-number">' + (++day) + '</div>' +
                                '<div class="day-price">' +
                                '<span>￥</span>' +
                                '<span>'+(2300+i)+'</span>' +
                                '<span>起</span>' +
                                '<br>' +
                                '<span>余</span>' +
                                '<span>30</span>' +
                                '</div>' +
                                '</li>';
                            ul.innerHTML += li;
                        }
                    }
                }
            }
        }
    }
    if(ele.nodeName === "SPAN" && ele.className==="right"){
        for (let i = ulEle.children.length-1; i>=0; i--) {
            if(ulEle.children[i].classList.contains('month-tab') === true && i!==ulEle.children.length-1){
                ulEle.children[i].classList.remove('month-tab');
                ulEle.children[i+1].classList.add('month-tab');

                var ul = document.querySelector(".day");
                for (let i = 0; i < ul.children.length; i++) {
                    console.log(ul.children[i]);
                    ul.removeChild(ul.children[i--]);
                }
                if(ulEle.children[i+1].classList.contains('month-tab-9')){
                    var day =0;
                    for (let i = 0; i < 35; i++) {
                        if (i < 2) {
                            var li = '<li>' +
                                '</li>';
                            ul.innerHTML += li;
                        }else if(i>31) {
                            var li = '<li>' +
                                '</li>';
                            ul.innerHTML += li;
                        }
                        else {
                            var li =
                                '<li class="residual">' +
                                '<div class="border"></div>' +
                                '<div class="day-number">' + (++day) + '</div>' +
                                '<div class="day-price">' +
                                '<span>￥</span>' +
                                '<span>'+(2300+i)+'</span>' +
                                '<span>起</span>' +
                                '<br>' +
                                '<span>余</span>' +
                                '<span>30</span>' +
                                '</div>' +
                                '</li>';
                            ul.innerHTML += li;
                        }
                    }
                }
                if(ulEle.children[i+1].classList.contains('month-tab-10')){
                    var day =0;
                    for (let i = 0; i < 35; i++) {
                        if (i < 4) {
                            var li = '<li>' +
                                '</li>';
                            ul.innerHTML += li;
                        }  else {
                            var li =
                                '<li class="residual">' +
                                '<div class="border"></div>' +
                                '<div class="day-number">' + (++day) + '</div>' +
                                '<div class="day-price">' +
                                '<span>￥</span>' +
                                '<span>'+(2300+i)+'</span>' +
                                '<span>起</span>' +
                                '<br>' +
                                '<span>余</span>' +
                                '<span>30</span>' +
                                '</div>' +
                                '</li>';
                            ul.innerHTML += li;
                        }
                    }
                }
                if(ulEle.children[i+1].classList.contains('month-tab-11')){
                    var day =0;
                    for (let i = 0; i < 35; i++) {
                        if (i >29) {
                            var li = '<li>' +
                                '</li>';
                            ul.innerHTML += li;
                        }else {
                            var li =
                                '<li class="residual">' +
                                '<div class="border"></div>' +
                                '<div class="day-number">' + (++day) + '</div>' +
                                '<div class="day-price">' +
                                '<span>￥</span>' +
                                '<span>'+(2300+i)+'</span>' +
                                '<span>起</span>' +
                                '<br>' +
                                '<span>余</span>' +
                                '<span>30</span>' +
                                '</div>' +
                                '</li>';
                            ul.innerHTML += li;
                        }
                    }
                }

            }
        }
    }
    /*月份点击*/
    if(ele.nodeName === "LI"){
        var liEle = ele.parentElement.children;
        for (let i = 0; i < liEle.length; i++) {
            liEle[i].classList.remove('month-tab');
        }
        ele.classList.add('month-tab');

        var ul = document.querySelector(".day");

        for (let i = 0; i < ul.children.length; i++) {
            console.log(ul.children[i]);
            ul.removeChild(ul.children[i--]);
        }
        if(ele.classList.contains('month-tab-9')){
            var day =0;
            for (let i = 0; i < 35; i++) {
                if (i < 2) {
                    var li = '<li>' +
                        '</li>';
                    ul.innerHTML += li;
                }else if(i>31) {
                    var li = '<li>' +
                        '</li>';
                    ul.innerHTML += li;
                }
                else {
                    var li =
                        '<li class="residual">' +
                        '<div class="border"></div>' +
                        '<div class="day-number">' + (++day) + '</div>' +
                        '<div class="day-price">' +
                        '<span>￥</span>' +
                        '<span>'+(2300+i)+'</span>' +
                        '<span>起</span>' +
                        '<br>' +
                        '<span>余</span>' +
                        '<span>30</span>' +
                        '</div>' +
                        '</li>';
                    ul.innerHTML += li;
                }
            }
        }
        if(ele.classList.contains('month-tab-10')){
            var day =0;
            for (let i = 0; i < 35; i++) {
                if (i < 4) {
                    var li = '<li>' +
                        '</li>';
                    ul.innerHTML += li;
                }  else {
                    var li =
                        '<li class="residual">' +
                        '<div class="border"></div>' +
                        '<div class="day-number">' + (++day) + '</div>' +
                        '<div class="day-price">' +
                        '<span>￥</span>' +
                        '<span>'+(2300+i)+'</span>' +
                        '<span>起</span>' +
                        '<br>' +
                        '<span>余</span>' +
                        '<span>30</span>' +
                        '</div>' +
                        '</li>';
                    ul.innerHTML += li;
                }
            }
        }
        if(ele.classList.contains('month-tab-11')){
            var day =0;
            for (let i = 0; i < 35; i++) {
                if (i >29) {
                    var li = '<li>' +
                        '</li>';
                    ul.innerHTML += li;
                }else {
                    var li =
                        '<li class="residual">' +
                        '<div class="border"></div>' +
                        '<div class="day-number">' + (++day) + '</div>' +
                        '<div class="day-price">' +
                        '<span>￥</span>' +
                        '<span>'+(2300+i)+'</span>' +
                        '<span>起</span>' +
                        '<br>' +
                        '<span>余</span>' +
                        '<span>30</span>' +
                        '</div>' +
                        '</li>';
                    ul.innerHTML += li;
                }
            }
        }
    }

    if(ele.nodeName === "LI" && ele.classList.contains('residual')){
        var date = document.querySelector(".date");
        console.log(date);
    }
    console.log(ele.nodeName);
}

document.querySelector(".day").onclick = function (event){
    var ele = event.target;
    if(ele.nodeName === "DIV" && ele.classList.contains('border')){
        var childrenEle = ele.parentElement.parentElement;
        for (var i = 0; i < childrenEle.children.length; i++) {
            if(childrenEle.children[i].classList.contains('residual')){
                childrenEle.children[i].children[0].classList.remove('day-bc');
            }
        }
        ele.classList.add('day-bc');
        for (let i = 0; i < childrenEle.children.length; i++) {
            if (childrenEle.children[i].classList.contains('residual')){
                childrenEle.children[i].children[1].style.color='#999';
                childrenEle.children[i].children[2].style.color='#38c4ff';
            }
        }
        ele.parentElement.children[1].style.color='white';
        ele.parentElement.children[2].style.color='white';

        var day = ele.nextSibling.innerText;
        var date = document.querySelector(".date");
        var month = document.querySelector(".month-ul").children;
        var monthText ="";
        for (let i = 0; i < month.length; i++) {
            if(month[i].classList.contains('month-tab')){
                monthText=month[i].children[0].innerText;
            }
        }
        date.children[1].children[0].innerText =monthText+day+"日";

        /*每天的价格*/
        var startPrice = ele.parentElement.children[2].children[1].innerText;
        document.querySelector(".fri-price").children[1].innerText=startPrice;
        allPrice();
    }
}

document.querySelector(".adult-amount").onclick = function (event){
    var ele = event.target;
    var number = document.querySelector(".input-adult .number").innerText;
    // var price;
    var dayEle = document.querySelector(".day");
    if(ele.nodeName==="BUTTON" && ele.innerText === "+"){
        var flag = false;
        for (var i = 0; i < dayEle.children.length; i++) {
            if (dayEle.children[i].classList.contains('residual')){
                if(dayEle.children[i].children[0].classList.contains('day-bc')){
                    flag=true;
                    price = parseFloat(dayEle.children[i].children[2].children[1].innerText);
                    break;
                }
            }
        }
        if(flag){
            document.querySelector(".input-adult .number").innerText=parseInt(number)+1;
            // var priceAdult = parseInt(document.querySelector(".input-adult .number").innerText);
            // document.querySelector(".fri-price").children[1].innerText=price*priceAdult;
        }else {
            alert("请先选择日期！");
        }
        allPrice();
    }
    // console.log(price);
    if(ele.nodeName==="BUTTON" && ele.innerText === "-"){
        if(number>1){
            document.querySelector(".input-adult .number").innerText=parseInt(number)-1;
            // var priceAdult = parseInt(document.querySelector(".input-adult .number").innerText);
            // document.querySelector(".fri-price").children[1].innerText=price*priceAdult;
        }
        allPrice();
    }


}

document.querySelector(".child-amount").onclick = function (event){
    var ele = event.target;
    var number = document.querySelector(".input-child .number").innerText;
    if(ele.nodeName==="BUTTON" && ele.innerText === "+"){
        var flag = false;
        var dayEle = document.querySelector(".day");
        // console.log(dayEle.children);
        // var price;
        for (var i = 0; i < dayEle.children.length; i++) {
            if (dayEle.children[i].classList.contains('residual')){
                if(dayEle.children[i].children[0].classList.contains('day-bc')){
                    // price = parseFloat(dayEle.children[2].children[2].children[1].innerText);
                    flag=true;
                }
            }
        }
        if(flag){
            // console.log(price);
            document.querySelector(".input-child .number").innerText=parseInt(number)+1;
            // var allPrice = parseFloat(document.querySelector(".fri-price").children[1].innerText);
            // var priceChild = parseInt(document.querySelector(".input-child .number").innerText);
            // document.querySelector(".fri-price").children[1].innerText=allPrice+price/2*priceChild;
        }else {
            alert("请先选择日期！");
        }
        // document.querySelector(".input-child .number").innerText=parseInt(number)+1;
        allPrice();
    }
    if(ele.nodeName==="BUTTON" && ele.innerText === "-"){
        if(number>0){
            document.querySelector(".input-child .number").innerText=parseInt(number)-1;
        }
        allPrice();
    }
}

function allPrice(){
    /*获得成人数量*/
    var adultNumber = parseInt(document.querySelector(".input-adult .number").innerText);
    /*获得儿童数量*/
    var childNumber = parseInt(document.querySelector(".input-child .number").innerText);

    var price;
    var dayEle = document.querySelector(".day");
    for (var i = 0; i < dayEle.children.length; i++) {
        if (dayEle.children[i].classList.contains('residual')){
            if(dayEle.children[i].children[0].classList.contains('day-bc')){
                price = parseFloat(dayEle.children[i].children[2].children[1].innerText);
                break;
            }
        }
    }
    document.querySelector(".fri-price").children[1].innerText = price*adultNumber+(price/2)*childNumber;


}